<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
  <link href="https://cdn.staticfile.org/layui/2.7.6/css/layui.css" rel="stylesheet">
  <script src="https://cdn.staticfile.org/layui/2.7.6/layui.js"></script>
</head>
<style>
  #boxone {
    background: rgb(243, 241, 241);

  }

  img {
    width: 10%;
  }

  ul {
    width: 100%;
  }

  #demo {
    width: 100%;

    margin-top: 10px;
  }

  .boxthree {
    width: 100%;
    margin-top: 20px;
    background: #ffff;
    float: left;
  }

  img {
    float: left;
    width: 258px;
  }

  ul li {
    float: left;
    padding-right: 110px;
    margin-left: 100px;
    line-height: 120px;
    width: 60%;

  }

  li {
    font-size: 24px;
  }

  #Ticketpurchase {
    float: right;
    margin-top: 60px;
  }

  .boxlest {
    width: 30%;
    background: #0000;
    float: left;
  }

  .boxright {
    width: 70%;
    background: rgba(193, 49, 49, 0);
    float: left;
  }
</style>

<body>
  <div class="layui-row">
    <div class="layui-col-xs12 layui-col-md12" id="boxone">
      <div class="grid-demo grid-demo-bg2">移动：6/12、桌面：12/12</div>
    </div>
    <div class="layui-col-xs12 layui-col-md12" id="boxone">
      <div class="grid-demo grid-demo-bg2">移动：6/12、桌面：12/12</div>
    </div>
    <div class="layui-col-xs12 layui-col-md12" id="boxone">
      <div class="grid-demo grid-demo-bg2">

        <!-- <ul class="flow-default" id="LAY_demo1"></ul> -->
        <div class="flow-default" id="demo">

        </div>
      </div>
    </div>
  </div>
</body>
<script>
  // layui.use('flow', function(){
  //   var flow = layui.flow;

  //   flow.load({
  //     elem: '#LAY_demo1' //流加载容器
  //     ,scrollElem: '#LAY_demo1' //滚动条所在元素，一般不用填，此处只是演示需要。
  //     ,done: function(page, next){ //执行下一页的回调

  //       //模拟数据插入
  //       setTimeout(function(){
  //         var lis = [];
  //         for(var i = 0; i < 8; i++){
  //           lis.push('<li>'+ ( (page-1)*8 + i + 1 ) +'</li>')
  //         }

  //         //执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
  //         //pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
  //         next(lis.join(''), page < 10); //假设总页数为 10
  //       }, 500);
  //     }
  //   });
  // })
  layui.use('flow', function () {
    var $ = layui.jquery; //不用额外加载jQuery，flow模块本身是有依赖jQuery的，直接用即可。
    var flow = layui.flow;
    flow.load({
      elem: '#demo' //指定列表容器
        ,
      done: function (page, next) { //到达临界点（默认滚动触发），触发下一页
        var lis = [];
        arr = ''
        //以jQuery的Ajax请求为例，请求下一页数据（注意：page是从2开始返回）
        $.get('https://liu.zzgoodqc.cn/movie/list?page=' + page, function (res) {
          //假设你的列表返回在data集合中
          console.log(res);
          layui.each(res.coming, function (index, item) {
            lis.push(
              `<div class="boxthree" onclick="fun(${item.id},${page})"><div class='boxlest'><img src="${item.img}" alt=""></div>` + `<div class='boxright'><ul class='addul'>
                                 <li>${item.nm}</li><br>
                                 <li>主演：${item.star} <button class="layui-btn layui-btn-radius layui-btn-danger" id=
                                  'Ticketpurchase'>购票</button></li>
                                 <li>淘票票评分：${item.sc}</li>
                                  </ul></div></div>`
              // '<dt>'+   `<img src="${item.img}" alt="">` +'</dt>' + '<dd>' +item.id + '</dd> '
            );

          });

          //执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
          //pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
          next(lis.join(''), page < 4);
        });
      }
    });
  });


  function fun(i,yes,name) { 
    var Arr = []
    Arr = JSON.parse(localStorage.getItem('Arr')) ?? []
        Arr = ({
            first_few:i,
            Jump:yes,
        })
        localStorage.setItem('Arr', JSON.stringify(Arr))
    confirm('确定购票吗')
    setInterval(function () {
      window.location.href = './sw.html'
    }, 1000)
  }
</script>

</html>